import React from 'react'
import { changeNav } from '../../actions'
import { connect } from 'react-redux'
import { List,Button } from 'antd-mobile'
import CSSModules from 'react-css-modules'
import styles from './alreadybizDetail.less'

const Item = List.Item
const Brief = Item.Brief;

@CSSModules(styles, { allowMultiple: true })
class GroupDetail extends React.Component {

	componentDidMount(){
	    this.props.tochangeNav({title:"已开通业务详情"})
	    // console.log( this.props.params.type )
	}

	render(){
		return(
			<div>
				<List>
					<Item
			          thumb={
			          	<img style={{ width:"100px",height:"100px" }} src="https://zos.alipayobjects.com/rmsportal/dNuvNrtqUztHCwM.png"/>
			          }
			          onClick={() => {}}
			          arrow="empty"
			        >
			          智慧餐厅<Brief>单店版</Brief>
			        </Item>
			    </List>

			    <List renderHeader={() => '配置业务信息'}>
				    <Item
			          arrow="horizontal"
			          extra="去续费"
			          onClick={ ()=>{} }
			        >
			          	<div styleName="bizcell">
							<div styleName="bizname">点餐</div>
							<div style={{ float:"right",background:"#fff",marginLeft:"0.1rem",padding: "0.2rem" }}>
								还有2天到期
							</div>
						</div>
						
			        </Item>
			        <Item
			          arrow="horizontal"
			          extra="去续费"
			          onClick={ ()=>{} }
			        >
			          	<div styleName="bizcell">
							<div styleName="bizname">外送</div>
							<div style={{ float:"right",background:"#fff",marginLeft:"0.1rem",padding: "0.2rem" }}>
								还有2天到期
							</div>
						</div>
						
			        </Item>
			        <Item
			          arrow="empty"
			        >
			          	<div styleName="bizcell">
							<div styleName="bizname">预定</div>
						</div>

						<div styleName="bizcell">
							<div styleName="bizname">预定</div>
						</div>
						
			        </Item>
			    </List>
			</div>
		)
	}
	/*
<Button className="btn" inline
							style={{ marginLeft:"0.1rem",verticalAlign: "middle",float: "right" }}
						>去续费 > </Button>
	*/
}

const mapStateToProps = ( state ) => ({
	  
})

const mapDispatchToProps = (dispatch) => ({
	tochangeNav:navobj => dispatch( changeNav( navobj ) )
})

export default connect( mapStateToProps,mapDispatchToProps )( GroupDetail )